

// 常用特效鼠标移入事件 ul

// 1.获取ul，绑定鼠标移动事件
var ulObj=document.querySelector('ul')
//  console.log(ulObj);

ulObj.onmousemove=function(evt){
    // 1.2获取事件对象
    var e=evt||window.event
    // 1.3获取操作的标签
    var targetObj=e.target||e.srcElement
    // 1.4判断操作的标签是否是li，如果是li 就显示提示信息
    if(targetObj.nodeName=='LI'){
        // 1.4.1获取div提示信息框，修改其位置
        var divObj=document.querySelector('.tip')
       divObj.style.display='block'
        var w=parseInt(getComputedStyle(divObj).width)
        var h=parseInt(getComputedStyle(divObj).height)
        // console.log(w,h);
       divObj.style.left=e.clientX-(w/2)+'px'
      divObj.style.top=e.clientY-(h/2)-20+'px'
    } 
}

// 2.获取ul，绑定鼠标移出事件
document.querySelector('ul').onmouseout=function(){
    var divObj=document.querySelector('.tip')
       divObj.style.display='none'
}